<template>
  <!--  页面  -->
  <div class="home-container">
    <div>
      <h3>漫游导航</h3>
      <el-button @click="systemStore.setTourStatus(true)" type="primary">漫游导航开启</el-button>
    </div>

    <div>
      <h3>设置</h3>
      <el-button @click="systemStore.settings.settingsVisible = true" type="primary">打开设置</el-button>
      <el-button @click="systemStore.settings.settingsVisible = true" type="success">打开设置</el-button>
      <el-button @click="systemStore.settings.settingsVisible = true" type="warning">打开设置</el-button>
      <el-button @click="systemStore.settings.settingsVisible = true" type="danger">打开设置</el-button>
      <el-button @click="systemStore.settings.settingsVisible = true" type="info">打开设置</el-button>
    </div>

    <div>
      <h3>组件缓存测试</h3>
      <div>count 值 : {{ count }}</div>
      <br>
      <el-button type="primary" @click="count += 1">count + 1</el-button>
    </div>
  </div>
</template>

<script setup lang="ts">
// 数据
import {useSystemStore} from "@/store/modules/system";
import {Ref} from "vue";

defineOptions({
  name: "Home",
  inheritAttrs: false,
});
const count: Ref<number> = ref<number>(0);
const systemStore = useSystemStore();


</script>

<style scoped lang="scss">
/* 样式 */
.home-container {
  display: flex;
  flex-direction: column; /* 设置基准线为上下方向 */
  justify-content: center;
}
</style>
